<template>
  <div class ="main">
    <van-nav-bar title="医院详情" left-text="返回" left-arrow  @click-left="onClickLeft">
    </van-nav-bar>
      <van-row class ="text-style flex">
        <van-col span="4"><van-image class="small-img" :src="tabimg6"/></van-col>
        <van-col span="16" class="align-left">
          <van-row >
            <van-col span="10">
              <span class="text-overstriking">中国科学医学院</span>
            </van-col>
          </van-row>
          <div style="height: 10px"></div>
          <van-row>
            <van-col span="10">
              <van-icon name="bar-chart-o" size="30" /><span>医院详情</span>
            </van-col>
          </van-row>
          <div style="height: 5px"></div>
          <van-row>
            <van-col span="10">
              <van-icon name="clock-o" size="30" /><span>每天9点开放</span>
            </van-col>
          </van-row>

        </van-col>
        <van-col span="4">
          <van-row>
            <van-col span="24">
              <van-icon name="description" size="40" />
            </van-col>
          </van-row>
          <div style="height: 5px"></div>
          <van-row>
            <van-col span="24">
              <span>医院详情</span>
            </van-col>
          </van-row>
        </van-col>
      </van-row>
    <van-search
      show-action
      placeholder="请输入搜索关键词"
      @search="onSearch"
    >
    </van-search>
      <van-row>
        <van-col span="24">
          <van-tree-select
            :items="items"
            :active-id.sync="activeId"
            :main-active-index.sync="activeIndex"
            @click-nav="this.onNavClick"
          />
        </van-col>
      </van-row>

    </div>
</template>

<script>
export default {
  name: 'HospitalDetail',
  components: {},
  props: [],
  data () {
    return {
      items: [
        {
          // 导航名称
          text: '所有城市',
          badge: 3,
          // 是否在导航名称右上角显示小红点
          dot: true,
          // 导航节点额外类名
          className: 'my-class',
          // 该导航下所有的可选项
          children: [
            {
              // 名称
              text: '温州',
              // id，作为匹配选中状态的标识符
              id: 1
            },
            {
              text: '杭州',
              id: 2
            }
          ]
        },
        {
          // 导航名称
          text: '其他城市',
          badge: 3,
          // 是否在导航名称右上角显示小红点
          dot: true,
          // 导航节点额外类名
          className: 'my-class',
          // 该导航下所有的可选项
          children: [
            {
              // 名称
              text: '温州',
              // id，作为匹配选中状态的标识符
              id: 1
            },
            {
              text: '杭州',
              id: 2
            }
          ]
        }
      ],
      activeId: 1,
      activeIndex: 0,
      tabimg6: require('../assets/tabimg6.png')
    }
  },
  computed: {},
  created () {},
  mounted () {},
  watch: {},
  methods: {
    onNavClick (index) {
      console.log(index)
    },
    onSearch () {

    },
    onClickLeft () {
      this.$router.go(-1)
    }
  }
}
</script>

<style scoped lang='less' >
  .align-left {
    text-align: left;
  }

</style>
